<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>相对定位</title>
    <!--相对定位完成的过程是首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来)，
    然后相对于以前的位置移动，移动的方向和幅度由left、right、top、bottom属性确定，偏移前的位置保留不动。-->
    <style>
        div{
            border : red solid 1px;
            width: 200px;
            height: 200px;
            position: relative;
            left: 100px;
            top: 20px;
        }
    </style>
</head>
<body>
    <div>
        div
    </div>
    <span>我应该在偏移前div的下面。偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span>
</body>
</html>